/*
 * @Author: nengwu 409791297@qq.com
 * @Date: 2020-07-01 23:43:55
 * @LastEditors: mylesshie@gmail.com
 * @LastEditTime: 2020-08-15 21:55:03
 * @description:
 */

import React, { useCallback, useEffect, useState } from 'react'
import { useSelector, useDispatch } from 'react-redux'
import { FlatList, SafeAreaView } from 'react-native'
import EmptyList from '@/components/EmptyList'
import FeedItem from '@/components/FeedItem'
import styles from './styles'
import * as userActions from '@/actions/user'

const MyFeedbacks = props => {
  const dispatch = useDispatch()
  const [pageNum, setPageNum] = useState(1)
  const [loading, setLoading] = useState(true)
  const [isRefreshing, setIsRefreshing] = useState(false)
  const [pageEnd, setPageEnd] = useState(false)
  const feedbackList = useSelector(state => state.user.feedbackList)
  const pageSize = 20

  const getList = useCallback(() => {
    dispatch(userActions.getFeedbackList(pageNum, pageSize)).then(() => {
      setLoading(false)
      setIsRefreshing(false)
    })
  }, [dispatch])

  useEffect(() => {
    getList()
  }, [])

  const _renderItem = ({ item }) => (
    <FeedItem
      sugDesc={item.sugDesc}
      createdTime={item.createdTime}
      headImg={item.headImg}
    />
  )

  const _onRefresh = () => {
    setPageNum(1)
    setIsRefreshing(true)
    getList()
  }

  const _onLoadMore = () => {
    if (pageEnd) return
    setPageEnd(pageNum + 1)
    getList()
  }

  return (
    <>
      {/* <StatusBar barStyle="dark-content" backgroundColor="#fff"/> */}
      {/* <Headers title="我提交的" /> */}
      <SafeAreaView style={styles.wrap}>
        {loading ? null : (
          <FlatList
            data={feedbackList}
            renderItem={_renderItem}
            onRefresh={_onRefresh}
            refreshing={isRefreshing}
            onEndReached={_onLoadMore}
            keyExtractor={item => item.createdTime}
            ListEmptyComponent={<EmptyList />}
          />
        )}
      </SafeAreaView>
    </>
  )
}

export default MyFeedbacks
